<template>
    <view class="icon-favorite flex-center shadow" @click.stop="click">
        <iconfont size="24px" :color="color" :name="name"></iconfont>
    </view>
</template>

<script>
export default {
    name: 'favorite',
    emits: ['action'],
    props: {
        color: {
            type: String,
            default: ''
        },
        name: String
    },
    data() {
        return {
            isFavotite: false
        };
    },

    methods: {
        click() {
            this.$emit('action');
        }
    }
};
</script>

<style lang="scss" scoped>
.icon-favorite {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #fff;
}
</style>
